body {
    padding-bottom: env(safe-area-inset-bottom);
}

.bottom-logo {
    color: #DCDCDC;
    font-size: 15px;
    text-align: center;
}

.main_bg {
    background-color: #ECE6D5;
}

.weui_grid_icon_fa {
    color: #3FB5F8;
    font-size: 26px;
}

.agent_star {
    color: #F9DE33;
    /*width:28px;*/
    font-size: 20px;
}

.menu_item_icon {
    color: #ED5340;
    width: 28px;
    font-size: 20px;
}

.agent_menu_item_icon {
    color: #3FB5F8;
    width: 28px;
    font-size: 20px;
}

.gm_report_item_icon {
    color: #3FB5F8;
    width: 50px;
    font-size: 50px;
}

.gm_menu_item_icon {
    color: #3FB5F8;
    width: 28px;
    font-size: 20px;
}

.gm_tab_icon_on {
    color: #3FB5F8;
    height: 20px;
    font-size: 18px;
}

.gm_tab_icon {
    color: #DCDCDC;
    height: 20px;
    font-size: 18px;
}

.weui_grid_icon_fa_gray {
    color: gray;
    font-size: 26px;
}

.weui_grid_icon_fa_black {
    color: black;
    font-size: 26px;
}

.weui_grid_icon_fa_red {
    color: #ED5340;
    font-size: 26px;
}

.weui_mp_grid_icon_fa {
    color: #ED5340;
    font-size: 26px;
}

.red_pack {
    color: #ED5340;
}

.main_color {
    color: #ED5340;
}

.center-box {
    color: gray;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}

.qrcode-icon-gm {
    color: #000000;
}

.qrcode-icon-general-agent {
    color: #CC1414;
}

.qrcode-icon-agent {
    color: #3FB5F8;
}

.qrcode-gm {
    width: 280px !important;
    height: 280px !important;
    border: thin solid #000000;
}

.qrcode-general-agent {
    width: 280px !important;
    height: 280px !important;
    /*border: thin solid #CC1414;*/
    border: thin solid #ef6d85;
}

.qrcode-agent {
    width: 280px !important;
    height: 280px !important;
    border: thin solid #3FB5F8;
}

.weui-icon_gallery-home {
    color: #FFFFFF;
    font-size: 22px;
}

.avatar {
    width: 60px !important;
    height: 60px !important;
    border-radius: 5px;
}

.homepage-avatar {
    width: 140px !important;
    height: 140px !important;
    border-radius: 70px;
}

.left_message_box {
    margin-right: .8em;
    width: 36px;
    height: 36px;
    line-height: 60px;
    text-align: center;
}

.left_small_avatar {
    /*padding-left:13px;*/
    /*position:relative;*/
    margin-left: 5px;
    width: 36px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    /*vertical-align:top;*/
    border-radius: 5px;
    display: block
}

.right_small_avatar {
    margin-right: 5px;
    width: 36px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    border-radius: 5px;
    display: block
}

.right_large_avatar {
    margin-right: 5px;
    width: 60px !important;
    height: 60px !important;
    line-height: 60px;
    text-align: center;
    border-radius: 5px;
    display: block
}

.right_large_avatars {
    float: left;
    margin-top: 9px !important;
    margin-right: 9px !important;
    /*margin-bottom:9px;*/
    width: 60px;
    height: 60px;
    background: no-repeat center center;
    background-size: cover;
    border-radius: 5px;
}

.weui-uploader__file {
    float: left;
    margin-right: 9px !important;
    /*margin-bottom:9px !important;*/
    margin-top: 9px !important;
    width: 79px;
    height: 79px;
    background: no-repeat center center;
    background-size: cover;
}

.promote-img {
    display: block;
    width: 100%;
    height: auto;
}

.promote-download-button {
    position: absolute;
    top: 180px;
    /*left:60px;*/
    width: 50%;
    z-index: 2;
}

.list-item-icon {
    color: #61B2FC;
    font-size: 60px;
}

.activity-button {
    width: 100%;
    margin-top: -35%;
    text-align: center;;
    overflow: hidden;
    position: relative;
}

.activity-button img {
    width: 60%;
    margin: 10px auto;
}

.activity-bg {
    width: 100%;
    height: 100%;
    text-align: center;
    overflow: hidden;
}

.activity-bg img {
    width: 100%;
}

.pp-video {
    width: 80%;
}

.home-title {
    margin-top: 5%;
    text-align: center;
    font-size: 49px;
    color: #ED5340;
}

.video_cover__thumb {
    max-width: 60px !important;
    width: 100% !important;
    height: 100% !important;
    border-radius: 5px;
    vertical-align: top;
}

/*
 * VIP
 */

.black-background {
    background-color: #100F0F;
}

.vip-bg {
    width: 100%;
    height: 100%;
    text-align: center;
    overflow: hidden;
    align: center;
}

.vip-black-background {
    background-color: #100F0F;
    position: absolute;
    top: 0%;
}

.vip-bg img {
    width: 100%;
}

.vip-head {
    width: 100%;
    height: 100%;
    text-align: center;
    overflow: hidden;
}

.vip-status {
    color: #fff;
    /*font-size: 2vw;*/
    font-size: 12px;
    margin-top: -36px;
}

.vip-privilege {
    margin-top: 20px;
    margin-bottom: 20px;
    display: block;
    width: 90%;
    height: auto;
}

.vip-cards {
    white-space: nowrap;
}

.vip-card {
    margin: 1px;
}

.vip-cards img {
    width: 21%;
    height: 21%;
}

.vip-buy-button {
    margin: 20px;
    position: relative;
    width: 90%;
}

.big-number {
    /*color: #ED5340;*/
    /*color: #3FB5F8;*/
    font-size: 20px;
    margin-bottom: 0px;
}

.placeholder-title {
    margin: 5px;
    padding: 0 10px;
    background-color: #ebebeb;
    height: 2.3em;
    line-height: 2.3em;
    text-align: center;
    color: grey;
}

.placeholder-green {
    margin: 5px;
    padding: 0 10px;
    background-color: #3FB5F8;
    height: 2.3em;
    line-height: 2.3em;
    text-align: center;
    color: white;
}

.placeholder-red {
    margin: 5px;
    padding: 0 10px;
    background-color: #ED5340;
    height: 2.3em;
    line-height: 2.3em;
    text-align: center;
    color: white;
}

.placeholder-gray {
    margin: 5px;
    padding: 0 10px;
    background-color: #ebebeb;
    height: 2.3em;
    line-height: 2.3em;
    text-align: center;
    color: grey;
}

.placeholder-yellow {
    margin: 5px;
    padding: 0 10px;
    background-color: #ffec6d;
    height: 2.3em;
    line-height: 2.3em;
    text-align: center;
    color: gray;
}

.weui-grid__icon2 {
    width: 72px !important;
    /*height:28px;*/
    margin: 0 auto;
}

.weui-grid__icon2 img {
    display: block;
    width: 100% !important;
    height: 100% !important;
}

.weui-grid__label2 {
    display: block;
    text-align: center;
    color: #3FB5F8;
    font-size: 12px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.page_icon {
    width: 96px;
}

.light_white_color {
    color: whitesmoke;
}

/* ======================  Font  ====================== */

.f-xxl {
    font-size: 4em;
}

.f-xl {
    font-size: 2em;
}

.f-m {
    font-size: 14px;
}

/* ======================  Link  ====================== */

.my-link {
    color: white;
}

.my-link a:link {
    color: white;
}

.my-link a:hover {
    color: white;
}

.my-link a:active {
    color: white;
}

.my-link a:visited {
    color: white;
}

/* ======================  Color  ====================== */

.green_color {
    color: #3FB5F8;
}

.red_color {
    color: #ED5340;
}

.yellow_color {
    color: orange;
}

.blue_color {
    color: lightseagreen;
}

.brown_color {
    color: brown;
}

.egg_color {
    color: #E9A872;
}

.light_yellow_color {
    color: #ffec6d;
}

.gray_color {
    color: gray;
}

.brief-icon-color {
    color: #AAAAAA;
}

.caster-bg {
    background-color: #509863 !important;
    color: #ffffff;
}

.watcher-bg {
    background-color: #7B8AD8 !important;
    color: #ffffff;
}

.danger_color {
    color: #ed5565;
}

/* ======================  Brief  ====================== */

.gma-title {
    color: #181818;
    font-size: 1.7em;
    font-weight: normal;
    margin-left: 0px;
}

.brief-header {
    /*color: #B1E0C6;*/
    color: whitesmoke;
    font-size: 1em;
    font-weight: normal;
    margin-left: 0px;
}

.brief-footer {
    font-size: 1.2em;
    font-weight: lighter;
    margin-top: 20px;
    margin-left: 10px;
}

.text-right {
    text-align: right !important;
}

/* ======================  Page Head  ====================== */

.my-page-head {
    background-color: #509863;
}

.my-page-title {
    color: #F8FBF8;
    text-align: center;
    font-size: 20px;
    font-weight: 400;
    padding-top: 30px;
    padding-bottom: 10px;
}

.my-page-title-icon {
    color: #3FB5F8;
    font-size: 32px;
}

.my-entry-button-icon {
    font-size: 30px;
    width: 30px;
    color: #3FB5F8;
    text-align: center;
}

.my-entry-panel {
    color: black;
}

.my-entry-panel a:link {
    color: black;
}

.my-entry-panel a:hover {
    color: black;
}

.my-entry-panel a:active {
    color: black;
}

.my-entry-panel a:visited {
    color: black;
}

/* ======================  Footer  ====================== */

.my-footer-logo {
    font-size: 25px;
}

/* ======================  WEUI: page background  ====================== */

.gray-background {
    background-color: #ededed;
}

[v-cloak] {
    display: none
}

.banner-img {
    width: 100% !important;
    height: 60px !important;
    border-radius: 6px;
}

.banner-img-s {
    width: 95% !important;
    height: 60px !important;
    border-radius: 6px;
}

.gray-img {
    -webkit-filter: grayscale(1); /* Webkit */
    filter: gray; /* IE6-9 */
    filter: grayscale(1); /* W3C */
}

.gift-img {
    width: 60px !important;
    height: 60px !important;
    background-color: whitesmoke;
}

.align-left {
    text-align: left;
}

.align-right {
    text-align: right;
}

.registration_top{
    height: 906px;
    background-color: #0F0537;
    background-image: url("https://res.yyzb.com/gma/registration/top_bg.jpg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    -moz-background-size: 100% 100%;
}

.registration_bottom{
    height: 318px;
    background-repeat: no-repeat;
    background-image: url("https://res.yyzb.com/gma/registration/bottom_bg.jpg");
    background-size: 100% 100%;
    -moz-background-size: 100% 100%;
}

.registration_download_btn {width: 8rem}

.registration_input_btn{
    width:250px;
    height:30px;
    background-image: url("https://res.yyzb.com/gma/registration/input_btn.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    -moz-background-size: 100% 100%;
}

.registration_get_sms_btn{
    margin:1px;
    width:78px;
    height:28px;
    background-image: url("https://res.yyzb.com/gma/registration/get_sms_btn.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    -moz-background-size: 100% 100%;
    float: right;
}
